{% extends "myadmin/base.html" %}

{% block mainbody %}                
<h3>
会员信息管理
</h3>
<!--重置会员密码信息表单开始-->
<form id="edit-profile" action="{% url 'myadmin_users_updatepass' user.id %}" class="form-horizontal" method="post" onsubmit="return check(this)">
{% csrf_token %}
<fieldset>
    <legend>重置会员密码信息</legend>
    <div class="control-group">
        <label class="control-label" for="input01">账号：</label>
        <div class="controls">
            <input type="text" name="username" class="input-xlarge" id="input01" value="{{user.username}}" readonly="true"/>
        </div>
    </div>
    <div class="control-group">
        <label class="control-label" for="input01">真实姓名：</label>
        <div class="controls">
            <input type="text" name="name" class="input-xlarge" id="input01" value="{{user.name}}" readonly="true"/>
        </div>
    </div>
    <div class="control-group">
        <label class="control-label" for="pass01">密码：</label>
        <div class="controls">
            <input type="password" name="password" class="input-xlarge" id="pass01"/>
        </div>
    </div>
    <div class="control-group">
        <label class="control-label" for="tips"></label>
        <div id="tips"><label>强度</label><span></span><span></span><span></span><span></span><span></span></div>
    </div>
    <div class="control-group">
        <label class="control-label" for="input01">重复密码：</label>
        <div class="controls">
            <input type="password" name="repassword" class="input-xlarge" id="input01"/>
        </div>
    </div>

    <div class="form-actions">
        <button type="submit" class="btn btn-primary">修改</button> <button type="reset" class="btn">重置</button>
    </div>
</fieldset>
</form>
<!--重置会员密码信息表单结束-->

<script type="text/javascript">
    //检测密码值强度
    function checkStrong(val) {
        var modes = 0;
        if (val.length < 6) return 0;
        if (/\d/.test(val)) modes++;    //数字
        if (/[a-z]/.test(val)) modes++; //小写
        if (/[A-Z]/.test(val)) modes++; //大写  
        if (/\W/.test(val)) modes++;    //特殊字符
        if (val.length > 12) return 4;
        return modes;
    };

    //输入密码时检测密码强度
    $(function() {
        var aStr = ["弱爆", "弱", "中", "强", "牛逼"];

        $("#pass01").keyup(function() {
            var val = $(this).val();
            var num = checkStrong(val);
            switch (num) {
                case 0:
                    $("#tips span").css('background', 'yellow').text('').eq(num).css('background', 'red').text(aStr[num]);
                case 1:
                    $("#tips span").css('background', 'yellow').text('').eq(num).css('background', 'red').text(aStr[num]);
                    break;
                case 2:
                    $("#tips span").css('background', '#28ff28').text('').eq(num).css('background', 'green').text(aStr[num]);
                    break;
                case 3:
                    $("#tips span").css('background', '#28ff28').text('').eq(num).css('background', 'green').text(aStr[num]);
                    break;
                case 4:
                    $("#tips span").css('background', '#28ff28').text('').eq(num).css('background', 'green').text(aStr[num]);
                    break;
                default:
                    break;
            }
        })
    })

    //表单提交前进行数据校验
    function check(form){
        //校验密码长度
        var password = form.password.value;
        if (password.length < 6){
            alert("密码长度小于6位！");
            form.password.focus();
            return false;
        }

        //校验密码强度
        if (checkStrong(password) <= 1){
            alert("密码强度弱，请输入6位以上的字母、数字或符号！");
            form.password.focus();
            return false;
        }

        //校验重复密码是否一致
        var repassword = form.repassword.value;
        if (password != repassword){
            alert("重复输入密码不一致！");
            form.repassword.focus();
            return false;
        }

        return true;
    }
</script>
{% endblock %}